<template>
  <div>
    <el-dialog
      :title="title"
      :visible.sync="dialogVisible"
      width="60%"
      center
      :before-close="handleClose">
      <el-card>
        <el-form :model="equipment" :rules="rules" ref="house" label-width="125px">
          <el-row>
            <el-col :span="8">
              <el-form-item label="编码" prop="fnumber">
               <number-role-input class-key="EquipmentResult" v-model="equipment.fnumber"></number-role-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="名称" prop="fname" required>
                <el-input v-model="equipment.fname"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="简称" prop="fsimplename">
                <el-input v-model="equipment.fsimplename"></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="8">
              <el-form-item label="规格型号" prop="fmodel">
                <el-input v-model="equipment.fmodel"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="出厂日期" prop="foutdate" required>
                <el-date-picker
                  v-model="equipment.foutdate"
                  type="date"
                  style="width: 100%;"
                  format="yyyy-MM-dd HH:mm:ss"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="验收日期" prop="fcheckindate" required>
                <el-date-picker
                  v-model="equipment.fcheckindate"
                  type="date"
                  style="width: 100%;"
                  format="yyyy-MM-dd HH:mm:ss"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="功率" prop="fpower" required>
                <el-input v-model="equipment.fpower"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="设备分类" prop="ftype"  >
                <el-select  class="fullWidth" v-model="equipment.ftype" filterable placeholder="请选择" >
                  <el-option v-for="item in equipmentData" :key="item.value" :label="item.label"
                             :value="item.value+''">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="使用地点" prop="fuseraddress" required>
                <el-input v-model="equipment.fuseraddress"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="出厂编号" prop="foutnumber" required>
                <el-input v-model="equipment.foutnumber"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="购入日期" prop="fbuydate" required>
                <el-date-picker
                  v-model="equipment.fbuydate"
                  type="date"
                  style="width: 100%;"
                  format="yyyy-MM-dd HH:mm:ss"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="生产厂家" prop="fmanufacturer" required>
                <el-input v-model="equipment.fmanufacturer"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="主设备">
                <el-radio-group v-model="equipment.fismain" >
                  <el-radio :label="1" @change="()=>this.f7Disable=true" >是</el-radio>
                  <el-radio :label="0" @change="()=>this.f7Disable=false">否</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="采集数据" prop="fcollectdata">
                <el-radio-group  v-model="equipment.fcollectdata">
                  <el-radio :label="1">是</el-radio>
                  <el-radio :label="0">否</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="关键设备" prop="fiskey">
                <el-radio-group v-model="equipment.fiskey" >
                  <el-radio :label="1" >是</el-radio>
                  <el-radio :label="0">否</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="关联主设备" prop="fmainequipmentid">
                <input-select
                  v-if="!isLoading"
                  :f7Disable="f7Disable"
                  v-model="equipment.fmainequipmentid"
                  ref="equipment"
                  :loadShow="equipment.fmainequipmentname"
                  :f7-param="f7ParamEquipment"
                  title="设备列表">
                </input-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="技术水平" prop="flevel" required>
                <tie-enum v-if="!isLoading" v-model="equipment.flevel" className="cn.hxlc.tie.demo.core.enums.LevelEnum"
                          ></tie-enum>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="运行状态" prop="frunstate" required>
                <tie-enum v-if="!isLoading" v-model="equipment.frunstate"
                          className="cn.hxlc.tie.demo.core.enums.DeptEnum" ></tie-enum>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="吨位" prop="ftonnage">
                <el-input-number v-model="equipment.ftonnage" :precision="2" :step="0.1" :max="10"></el-input-number>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item  label="物料编码" prop="fmaterialid">
                <input-select
                  v-if="!isLoading"
                  v-model="equipment.fmaterialid"
                  ref="material"
                  :loadShow="equipment.fmaterialname"
                  :f7-param="f7Param"
                  title="物料列表">
                </input-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="车间" prop="fdeptname">
                <el-select class='fullWidth'  v-model="equipment.ffactoryid" filterable placeholder="请选择">
                  <el-option
                    v-for="item in deptData"
                    :key="item.value+''"
                    :label="item.label"
                    :value="item.value+''">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="备注" prop="fremark">
                <el-input v-model="equipment.fremark"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-card>
      <div slot="footer" class="dialog-footer">
        <el-button v-if="!isView" type="primary" @click="submitForm()">提交</el-button>
        <el-button v-if="!isView" type="primary"@click="handleClose">取消</el-button>
        <el-button v-if="isView" type="primary"@click="handleClose">保存</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import Psy from "@/api/psyManage/Psy";
import Group from "@/api/psyManage/Group";

export default {
  name: "equipment_addEdit",

  props: {
    addOne:Object,
    width: { type: String, default: '60vw' },
    fgroupid: null,
    fid:null,
    status: ''
  },
  data() {
    const validategroupId = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请选择'))
      } else {
        callback()
      }
    };
    return {
      f7Disable:false,
      isView:false,
      title:"资料添加",
      dialogVisible: true,
      equipment: {
        fbuydate: null,
        fuselot: 0,
        fcollectdata: 0,
        ftonnage: 1,
      },
      deptData:'',
      equipmentData:'',
      equipmentFtype:'',
     value: '',
      nodeId: '',
      rules: {
        fname: [{required: true, message: '名称不能为空', trigger: 'blur'}],
        fmodel: [{required: true, message: '规格型号不能为空', trigger: 'blur'}],
        frunstate: [{required: true, message: '运行状态不能为空', trigger: 'blur'}],
        flevel: [{required: true, message: '技术水平不能为空', trigger: 'blur'}],
        fmanufacturer: [{required: true, message: '生产厂家不能为空', trigger: 'blur'}],
        foutdate: [{required: true, message: '出厂日期不能为空', trigger: 'blur'}],
        fgroupId: [{ required: true, validator: validategroupId, trigger: 'change' }],
        fcheckindate: [{required: true, message: '交付日期不能为空', trigger: 'blur'}],
        fpower: [{required: true, message: '功率不能为空', trigger: 'blur'}],
       // ftype: [{required: true, message: '设备类型不能为空', trigger: 'blur'}],
        fuseraddress: [{required: true, message: '使用地点不能为空', trigger: 'blur'}],
        foutnumber: [{required: true, message: '出厂编号不能为空', trigger: 'blur'}],
        fbuydate: [{required: true, message: '购入日期不能为空', trigger: 'blur'}],

      },
      fnumberAnable: true,
      groupTreeData: [],
      f7Param: {},
      f7ParamEquipment:{},
      fmaterialid: '',
      fnumber: null,
      isLoading: true,
    }
  },
  async created() {
    this.f7Param = {

      selectId:'fid',
      selectUrl:'/tie-mdm/material/queryListPage',
      selectTreeField:['fgroupid'],
      selectTreeUrl:'/tie-mdm/materialGroup/queryGroupTree',
      selectShow:{spt:'',field:['fname']},
      column:[{lable:'编号',prop:'fnumber',isFilter:true,filterField:'fnumber'},{lable:'名称',prop:'fname',isFilter:false,filterField:'fname'}
        ,{lable:'规格型号',prop:'fmodel',isFilter:false,filterField:'fmodel'}
        ,{lable:'简称',prop:'fsimplename',isFilter:true,filterField:'fsimplename'}
      ],
      defaultFilter:[{field:'fstatus',value:"USED"},{field:'fispackage',value:1}]
    }
    this.f7ParamEquipment={
        selectId:'fid',
        selectUrl:'/tie-demo/equip/queryListPage',
        selectTreeField:['fgroupid'],
        selectTreeUrl:'/tie-demo/groupTree/queryGroupTree',
        selectShow:{spt: '',field: ['fname']},
       column:[{lable:'编号',prop:'fnumber',isFilter:true,filterField:'fnumber'},{lable:'名称',prop:'fname',isFilter:false,filterField:'fname'}
         ,{lable:'规格型号',prop:'fmodel',isFilter:false,filterField:'fmodel'}
         ,{lable:'简称',prop:'fsimplename',isFilter:true,filterField:'fsimplename'}],
      defaultFilter:[{field:'fstatus',value:"BASE"},{field:'fismain',value:1}]
    }
    this.isLoading = true
    console.log(this.fid)
    //await this.getType();
    if (this.fid){
      let api=new Psy();
      this.title='编辑设备'
      let equipment=await api.detail({fid:this.fid})
      debugger
      this.equipment=equipment.data
    }
    let http=new Group()
    let groupTreeData=await http.queryGroupTree()
    groupTreeData.data.forEach((item,index)=>{
      if(item.nodeId===-1){
        groupTreeData.data.splice(index,1)
      }
    })
    this.groupTreeData=groupTreeData.data
    this.isLoading=false
     await this.getWorkshopName();
     await this.getEquipment();
  },
  methods: {
    change_fiskey(e){
      console.log(e)
    },


    /*async getType() {
      this.isLoading = true;
      let api = new Psy()
      let queryList = await api.queryListPage()
      const resp = queryList.data
      console.log(resp)

      const listData = resp.map(i => {
        return {label: i.fname, value: i.fid}
      })
      this.equipmentFtype=listData;
    },*/
    async getEquipment() {
      this.isLoading = true;
      let group = new Group()
      let groupTreeData = await group.queryGroupTree()
      const res = groupTreeData.data

      let groupData = res.map(function (i) {
        return {label: i.nodeName, value: i.nodeId}
      })
       this.equipmentData=groupData;
      this.isLoading = false
    },
    async getWorkshopName() {
      this.isLoading = true;
      let grop = new Group()
      let manufactory = await grop.getWorkList()
      const r = manufactory.data
      const deptNames = r.map(i => {
        return {label: i.deptName, value: i.deptId}
      })
      this.deptData = deptNames;
      console.log(this.deptData)
      this.isLoading = false
    },
    handleClose() {
      this.$emit("close",{name: "addEdit", isRefresh: true})
    },
    submitForm() {
      this.$refs['house'].validate((valid) => {
        if (valid) {
          const loading = this._loading()
          const api = new Psy();
          this.equipment.fgroupid = this.fgroupid;
          console.log(this.equipment)
          if(this.fid){
            api.update(this.equipment).then(res => {
              loading.close()
              this.$tie.showSuccess(res.message)
              this.$emit("close",{name: "addEdit", isRefresh: true})
            }).catch(e => {
              loading.close()
            })
          }else{
            api.addOne(this.equipment).then(res => {
              console.log(this.equipment)
              loading.close();
              this.$tie.showSuccess(res.message)
              this.$emit("close",{name: "addEdit", isRefresh:true})
            }).catch(e => loading.close)
          }

        }else{
          let validArr=[]
          Object.keys(object).forEach(function(key){
            validArr.push(key)
          });
          let validVal="#"+validArr[0];
          document.querySelector(validVal).scrollIntoView(true);
        }
        return false;
      })

    },
    //加载提示
    _loading() {
      return this.$loading({
        lock: true,
        text: '请耐心等待.....',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
    },
  }

}
</script>

<style scoped>
.fullWidth {
  width: 100%;
}
</style>
